<template>
  <div class="shop-cart-sticky" v-show="visible">
    <shop-cart
      ref="shopCart"
      :min-price="minPrice"
      :delivery-price="deliveryPrice"
      :selected-foods="selectedFoods"
      :fold="fold"
      :sticky=true
    ></shop-cart>
  </div>
</template>

<script>
import ShopCart from '../shop-cart/shop-cart.vue'
import popupMixin from '../../common/mixins/popup'

export default {
  mixins: [popupMixin],
  name: 'shop-cart-sticky',
  props: {
    minPrice: {
      type: Number,
      default: 0
    },
    deliveryPrice: {
      type: Number,
      default: 0
    },
    selectedFoods: {
      type: Array,
      default() {
        return []
      }
    },
    fold: {
      type: Boolean,
      default: true
    },
    list: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  methods: {
    drop(el) {
      this.$refs.shopCart.drop(el)
    }
  },
  components: {
    ShopCart
  }
}
</script>
<style lang='stylus' scoped>
.shop-cart-sticky
  z-index 101
  position absolute
  width 100%
  bottom 0
</style>
